<!-- 教练 – 首页 – 约课详情 – 课程详情 – 学员详情 – 点评		remark -->
<template>
	<view class="pb70">
		<view class="warps_box">
			<view class="dis-flex flex-center wd100">
				<view class="charts-box">
					<qiun-data-charts type="radar" :chartData="chartData" :errorShow="false" background="none" />
				</view>
			</view>
		</view>
		<view class="ml15 mr15 bg-fff p15 br10 mt15" style="	box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0,0,0,0.12); ">
			<u-collapse>
				<view v-for="(item, index) in data" :key="index">
					<view @click="dakai(index)" class="bb dis-flex flex-between wd100"
						style="height: 100rpx;line-height: 100rpx;">
						<view>
							<text>{{item.name}}</text>
						</view>
						<view v-if="item.is_show == 1">
							<u-icon name="arrow-up" color="#999999" size="28"></u-icon>
						</view>
						<view v-else>
							<u-icon name="arrow-down" color="#999999" size="28"></u-icon>
						</view>
					</view>
					 <view class=" " v-if="item.is_show == 1"  v-for="(item1, index1) in item.children" :key="index1" style="width: 100%; margin: auto; margin-bottom: 20px;">
						<view class="">
							<xfl-select
								:list="item1.children"
								:clearable="false"
								:showItemNum="100" 
								:style_Container="'height: 50px; font-size: 16px;width:100%'"
								:placeholder = "'无数据'"
								:initValue="item1.selected_name"
								:moren_name="item1.name"
								:weiyi="item1.id"
								:selectHideType="'hideAll'"
								@change="xuanchange"
							>
							</xfl-select>
						</view>
						
					</view>
				</view>
			</u-collapse>
		</view>
		<view class="teaching-top  ml15 mr15 mt15">
			<view class="w90 pb15 pt15" style="">
				<text class="fs32 bold">备注</text>
				<view class="p_t_20 wd100 f b c">
					<textarea class="fs22 wd100 " style="height: 200rpx;" maxlength="300" v-model="beizhu"
						placeholder="请填写备注信息"></textarea>
				</view>
			</view>
		</view>
		<view class="remark-top2 btn-submit-box ml20 mr20 " @click="tijiao">
			<button type="default">提交</button>
		</view>
	</view>
</template>

<script>
	import xflSelect from '@/components/xfl-select/xfl-select.vue';     //导入
	export default {
		components: { xflSelect },  //注册为子组件
		data() {
			return {
				show: false,
				chartData: {
					"categories": [
						"Breathing",
						"Falling",
						"Balanced",
						"Coordination"
					],
					"series": [{
						"name": "",
						"data": [
							0,
							0,
							0,
							0
						]
					}]
				},
				uid: '', //用户ID
				id: '', //约课记录ID
				data: [],
				index: '',
				openindex: '',
				jilu_index: [],
				tijiao_arr: [],
				beizhu: ''
			}
		},
		onLoad(e) {
			// 动态导航条文字
			uni.setNavigationBarTitle({
				title: '点评学员情况'
			})
			this.uid = e.uid
			this.id = e.id
			this.init()
		},
		methods: {
			init() {
				var that = this
				var json = {
					id: that.uid,
				}
				that.$http.post(that.$config.UrlPostjiaoanList, json).then((res) => {
					if (res.status == 1) {
						that.data = res.data
						var arr = [res.userinfo.breathing, res.userinfo.coordination, res.userinfo.balanced, res.userinfo
							.falling
						]
						console.log(arr)
						that.chartData.series[0].data = arr
					}
				})
			
			},
			tijiao() {
				var that = this
				var xxids = []
				var tijiao_arr = that.tijiao_arr
				for (let i = 0; i < tijiao_arr.length; i++) {
					xxids.push(tijiao_arr[i].id)
				}
				var json = {
					uid: that.uid,
					jlid: that.id,
					xxids: JSON.stringify(xxids),
					remark: that.beizhu,
				}

				that.$http.post(that.$config.UrlPostdojiaoan, json).then((res) => {
					if (res.status == 1) {
						that.$api.toast('点评成功')
						setTimeout(() => {
							that.$api.back()
						}, 500)
					}
				})
			},
			dakai(index) {
				this.index = index
				
				var data = this.data
				for (var i = 0; i < data.length; i++) {
					if(index == i){
						if(data[i].is_show == 0){
							data[i].is_show = 1
						}else{
							data[i].is_show = 0
						}
					}else{
						data[i].is_show = 0
					}
				}
			},
			xuanchange(e) {
				var arr = this.tijiao_arr
				var jilu = this.jilu_index
				if (jilu.indexOf(e.weiyi) == -1) {
					jilu.push(e.weiyi)
					var obj = new Object()
					obj.id = e.orignItem.id
					obj.weiyi = e.weiyi
					arr.push(obj)
				} else {
					for (var i = 0; i < arr.length; i++) {
						if (arr[i].weiyi == e.weiyi) {
							arr[i].id = e.orignItem.id
						}
					}
				}
				this.tijiao_arr = JSON.parse(JSON.stringify(arr))
				
			},

			get() {
				this.show = !this.show
			}
		}
	}
</script>

<style scoped>
	.biankuang{
		border-top: 2rpx solid #c0c4cc;
		border-left: 2rpx solid #c0c4cc;
		border-bottom: 2rpx solid #c0c4cc;
	}

	/* 雷达图 */
	.charts-box {
		width: 100%;
		height: 404rpx;
	}

	.warps_box {
		width: 686rpx;
		height: 400rpx;
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.12);
		margin: 0 auto;
		margin-top: 30rpx;
	}

	.teaching-top {
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.12);

	}

	.teaching-top2 {
		background: #ffffff;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.12);
	}

	.teaching-lan {
		width: 260rpx;
		height: 250rpx;
		opacity: 1;
		background: #f1f6ff;
		border-radius: 8rpx;
		margin-left: 450rpx;
	}

	.remark-top {
		margin-top: 62rpx;
	}

	.remark-top2>button {
		height: 72rpx;
		line-height: 72rpx;
		opacity: 1;
		background: #1f73f2;
		border-radius: 8rpx;
		color: #fff;
		font-size: 32rpx;
	}
</style>
